<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <title>批量导入</title>
    <link rel="stylesheet" href="../layui/css/layui.css"/>
    <link rel="stylesheet" href="../css/admin.css"/>
    <style>
        .layui-form{
      width: 330px;
      height: 140px;
      margin:0 auto;
        }
        .add-person th{
        width:120px;
        height:40px;
        margin-left:10px;
            font-size:14px;
        padding: 0;
        vertical-align: middle;
        }
        .add-person input{
        outline:none;
            width:160px;
            height: 28px;
            border:1px solid #E5BA70;
            border-radius:5px;
        }
      .add-person .selected1{
        font-size: 12px;
      }
      .add-person td{
        position: relative;
      }
      .add-person td a.input{
        display:inline-block;
        overflow:hidden;
        width: 66px;
        height: 28px;
        line-height:28px;
        background-color:#FABB42;
        position:absolute;
        top: 10px;
        right: 33px;
        border-radius: 0 5px 5px 0;
        color: #fff;
        text-align: center;
      }
      .add-person td .input input{
        width: 66px;
        height: 28px;
        background-color: blue;
        opacity:0;
        filter:alpha(opacity=0);
        font-size:100px;
        position:absolute;
        top:0;
        right:0;
      }
        .layui-form .layui-table{
            margin-top:50px;
            margin:0 auto;
        }
    #btn-cancel,#btn-send{
      border:0;
      margin-top:20px;
        outline:none;
      width:100px;
      height:28px;
      border-radius:5px;
      background-color: #D8D8D8;

    }
    #btn-cancel{
        margin-left:70px;
    }
    #btn-send{
        margin-left:15px;
    }
    #btn-send:hover,#btn-cancel:hover{
        color:#fff;
     background-color:#EF7632;
    }
    .layui-layer .layui-layer-title{
      background-color: #fff;
    }
    </style>
</head>
<body>
     <form class="layui-form" action="">
            <table class="layui-table layui-table-add" lay-skin="nob">
              <tbody>
               <tr class="add-person">
                  <th>下载模板</th>
                  <td><a href="http://wrench-tida.tunnel.echomod.cn/moudle.xls">点击此处下载模板</a></td>
                </tr>
                <tr class="add-person">
                  <th>选择xls文件</th>
                  <td>
                <input class="selected1" type="text" readonly="readonly" />
               <!-- <input type="file" name="file" class="layui-upload-file selected2" lay-title="选取"> -->
               <a href="javascript:void(0);" class="input"><input type="file" name="file" class="selected2">选取</a>
             </td>
                </tr>
              </tbody>
            </table>
          <button id="btn-cancel">取消</button>
          <button id="btn-send">保存</button>
        </form>
    <script type="text/javascript" src="../layui/layui.js"></script>
  <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
    <script>

  var params={};
  $(function(){
    $(".selected2").change(function(){  // 当 id 为 file 的对象发生变化时
        console.log(this.files[0].name);
        console.log($(".selected2").val());

        params.file = this.files[0].name;
        console.log(params.file);

        var pointIndex = this.files[0].name.indexOf(".");
        var houzhui = this.files[0].name.substring(pointIndex);

        console.log(houzhui);
        if(houzhui == ".xls"){
          // 上传步骤

        }else{
          layer.msg('文件格式不正确！');
          return;
        }
        $(".selected1").val(this.files[0].name);
        var fileSize = this.files[0].size;
        var size = fileSize / 1024 / 1024;
        if (size > 5) {
            alert("附件不能大于5M,请将文件压缩后重新上传！");
            this.value="";
            return false;
        }else{
            $(".selected1").val(this.files[0].name);  //将 #file 的值赋给 #file_name
        }
    })

});
  layui.use(['jquery','form','upload','layer'], function(){
      var $ = layui.jquery,layer = layui.layer;
           upload = layui.upload;


  $("#btn-send").click(function(){
      var danyuan_id =localStorage.getItem("danId");
          console.log(danyuan_id);

     layui.upload({
        url: '../../organization_manage/batchInputUser',
        type: 'POST',
        dataType: "json",
        data:{
           danyuan_id:danyuan_id,
           file:params.file
        }
        ,success: function(response){
          console.log(response); //上传成功返回值，必须为json格式
             var index=parent.layer.getFrameIndex(window.name);
             parent.layer.close(index);
        },
        error:function(response){
              console.log(response);
            var index=parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
            if(response.resultCode=='001'){
              console.log("param is not found");
                }
            }
      });

   });
   $("#btn-cancel").click(function(){
      console.log(456);
      parent.layer.close(index);
     })
    });
    </script>
</body>
</html>
